var container = document.querySelector(".swiper-container");
var banner = document.querySelector(".banner");
var ulElement = document.querySelector(".banner ul");
var points = document.querySelectorAll(".point ol li");
var btnLeft = document.querySelector(".btn-left");
var btnRight = document.querySelector(".btn-right");
var index = 0;
var square = 0;
var width = banner.offsetWidth;
var dingshiqi  = null;

var setPoint = function(key){
    for(var i = 0 ; i < points.length ; i ++){
        points[i].className = "";
    }
    points[key].className = "active";
}

var autoPlay = function(){
    index ++;
    if(index > 5){
        index = 1;
        ulElement.style["marginLeft"] = "0px";
    }
    animate(ulElement, "marginLeft", -(index * width));

    square ++;
    square = square > 4 ? 0 : square;
    setPoint(square);
}

// 实现轮播图自动播放
dingshiqi = setInterval(function(){  autoPlay(); },2000)

// 鼠标移入轮播图 暂停轮播图
container.addEventListener("mouseenter",function(){
        clearInterval(dingshiqi);
})
// 鼠标离开轮播图 暂停轮播图继续执行轮播
container.addEventListener("mouseleave",function(){
        clearInterval(dingshiqi);
        dingshiqi = setInterval(function(){  autoPlay(); },2000)
})

// 点击导航点实现图片切换
for(var j = 0 ; j < points.length ; j ++){
    points[j].aaa = j;
    points[j].onclick = function(){
        index = this.aaa ;
        square = this.aaa ;
        animate(ulElement, "marginLeft", -(index * width));
        setPoint(square);
    }
}

// 左边按钮
btnLeft.onclick = function(){
    if(dingshiqi) {
        clearInterval(dingshiqi);
    }
    index --;
    if(index < 0){
        index = 4;
        ulElement.style["marginLeft"] = "-2700px";
    }
    animate(ulElement,"marginLeft",-(index * width));
    square -- ;
    square = square < 0 ? 4 : square;
    setPoint(square);
}

// 右边按钮
btnRight.onclick = function(){
    if(dingshiqi){
        clearInterval(dingshiqi);
    }
    index ++;
    if(index > 5){
        index = 1;

        ulElement.style["marginLeft"] = "0px";
    }
    animate(ulElement,"marginLeft",-(index * width));
    square ++;
    square = square > 4 ? 0 : square;
    setPoint(square);

}